<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="bootstrap-3.3.7-dist/jquery-1.11.1/jquery.min.js"></script>
    <script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <style>
        select{
            width: 200px;
            height: 200px;
        }
    </style>
</head>
<body>


<table>
    <tr>
        <td>
            <select id="perm" multiple="multiple" >
                <option >登录</option>
                <option>管理</option>
                <option>下载</option>
                <option>大小</option>
            </select>
        </td>
        <td>

            <input type="button" value=">" id="rightMove" />
            <br/>
            <button>&gt;&gt;</button>
            <br/>
            <button>&lt;</button>
            <br/>
            <button>&lt;&lt;</button>
        </td>
        <td>
            <select  id="selPerm" multiple="multiple">

            </select>
        </td>
    </tr>
</table>
<script>

    $("#rightMove").click(function(){

        $("#perm option").each(function(){
            var opt=$(this).attr("selected");
            if(opt == "selected"){
                $("#selPerm").append($(this));
            }

        })
    })





</script>
</body>
</html>